<template>
  <view class="work-container">
    <!-- 宫格组件 -->
    <uni-section title="猪只管理" type="line"></uni-section>
    <view class="grid-body">
      <uni-grid :column="4" :showBorder="false">
		  <uni-grid-item v-for="(item, index) in pigList" :index="index" :key="index">
			<view class="grid-item-box" @click="changePigGrid(index)">
				<image class="image" :src="item.url"></image>
				<text class="text">{{item.text}}</text>
			</view>
		  </uni-grid-item>
      </uni-grid>
    </view>
	<!-- 物料管理 -->
	<uni-section title="物料管理" type="line"></uni-section>
	<view class="grid-body">
	  <uni-grid :column="4" :showBorder="false">
		  <uni-grid-item v-for="(item, index) in materialList" :index="index" :key="index">
			<view class="grid-item-box" @click="changeMaterialGrid(index)">
				<image class="image" :src="item.url"></image>
				<text class="text">{{item.text}}</text>
			</view>
		  </uni-grid-item>
	  </uni-grid>
	</view>
	<!-- 栏舍管理 -->
	<uni-section title="园区管理" type="line"></uni-section>
	<view class="grid-body">
	  <uni-grid :column="4" :showBorder="false">
		  <uni-grid-item v-for="(item, index) in parkList" :index="index" :key="index">
			<view class="grid-item-box" @click="changePhouseGrid()">
				<image class="image" :src="item.url"></image>
				<text class="text">{{item.text}}</text>
			</view>
		  </uni-grid-item>
	  </uni-grid>
	</view>
	<!-- 员工管理 -->
	<uni-section title="员工管理" type="line"></uni-section>
	<view class="grid-body">
	  <uni-grid :column="4" :showBorder="false">
		  <uni-grid-item v-for="(item, index) in staffList" :index="index" :key="index">
			<view class="grid-item-box" @click="changeStaffGrid()">
				<image class="image" :src="item.url"></image>
				<text class="text">{{item.text}}</text>
			</view>
		  </uni-grid-item>
	  </uni-grid>
	</view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
		pigList: [{
			url: '/static/images/work/dangan.png',
				text: '档案管理',
			},{
				url: '/static/images/work/saochadang.png',
				text: '扫码查档',
			},{
				url: '/static/images/work/peizhong.png',
				text: '配种记录',
			},{
				url: '/static/images/work/fenmian.png',
				text: '分娩记录',
			},{
				url: '/static/images/work/zhuanshe.png',
				text: '转舍记录',
			},{
				url: '/static/images/work/renjian.png',
				text: '妊检记录',
			},{
				url: '/static/images/work/chuchang.png',
				text: '出场记录',
			},{
				url: '/static/images/work/saochuchang.png',
				text: '扫码出场',
			}
		],
		materialList: [{
			url: '/static/images/work/jinhuo.png',
				text: '进货管理',
			},{
				url: '/static/images/work/store.png',
				text: '存储管理',
			},{
				url: '/static/images/work/xiaohao.png',
				text: '消耗管理',
			},{
				url: '/static/images/work/materialType.png',
				text: '类型管理',
			} 
		],
		parkList: [{
			url: '/static/images/work/park.png',
				text: '栏舍管理',
			}
		],
		staffList: [{
			url: '/static/images/work/staff.png',
				text: '员工管理',
			}
		],
	
		
      }
    },
    methods: {
		changePigGrid(index) {
			//console.log(index);
			if(index == 0){
				this.$tab.navigateTo('/pages/hmy/pig/index');
			}else if(index == 1){
				this.$tab.navigateTo('/pages/hmy/yyhtest/saochadang');
			}else if(index == 2){
				this.$tab.navigateTo('/pages/hmy/pigBreed/index');
			}else if(index == 3){
				this.$tab.navigateTo('/pages/hmy/pigLive/index');
			}else if(index == 4){
				this.$tab.navigateTo('/pages/hmy/pigTransfer/index');
			}else if(index == 5){
				this.$tab.navigateTo('/pages/hmy/pigPregnancy/index');
			}else if(index == 6){
				this.$tab.navigateTo('/pages/hmy/pigOut/index');
			}else if(index == 7){
				this.$tab.navigateTo('/pages/hmy/yyhtest/index');	
			}else{
				this.$modal.showToast('模块建设中~');
			}
		},
		
		changeMaterialGrid(index) {
	  		//console.log(index);
	  		if(index == 0){
	  			this.$tab.navigateTo('/pages/hmy/material/purchase');
	  		}else if(index == 1){
	  			this.$tab.navigateTo('/pages/hmy/material/store');
	  		}else if(index == 2){
	  			this.$tab.navigateTo('/pages/hmy/material/consume');
	  		}else if(index == 3){
	  			this.$tab.navigateTo('/pages/hmy/material/materialType');
	  		}else{
	  			this.$modal.showToast('模块建设中~');
	  		}
		},
		
		changePhouseGrid() {
			this.$tab.navigateTo('/pages/hmy/phouse/index');
		},
		
		changeStaffGrid() {
			this.$tab.navigateTo('/pages/hmy/staff/index');
		}
    }
  }
</script>index

<style lang="scss">
  /* #ifndef APP-NVUE */
  page {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background-color: #fff;
    min-height: 100%;
    height: auto;
  }

  view {
    font-size: 18px;
    line-height: inherit;
  }

  .image {
	  width: 25px;
	  height: 25px;
    }

  /* #endif */

  .text {
    text-align: center;
    font-size: 26rpx;
    margin-top: 10rpx;
  }

  .grid-item-box {
    flex: 1;
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 15px 0;
  }


  @media screen and (min-width: 500px) {
    .uni-swiper-dot-box {
      width: 400px;
      /* #ifndef APP-NVUE */
      margin: 0 auto;
      /* #endif */
      margin-top: 8px;
    }

    .image {
      width: 100%;
    }
  }
</style>
